H2InteractionsURL copied

H3Scripted Interaction & ResilienceURL copied

H4Mermaid Zoom & PanURL copied

• Mouse wheel zoom: Zooms toward cursor position with 1% intensity per wheel event (prevents jarring jumps)

• Mouse drag panning: Click and drag to pan, cursor changes to grabbing during drag

• Smart initial scaling:
  • Wide diagrams (aspect ratio > 3): Scale to fit width, allow vertical scroll
  • Normal diagrams: Fit to smaller dimension (width or height), max 3x upscaling
  • Accounts for padding: 32px total (16px each side from p-4 class)

• State management: Per-diagram state stored in mermaidStates object with scale, translateX, translateY, isPanning, startX, startY

• Transform origin: Center-center for natural zoom behavior